﻿@using MobileTrack.Core;

@{
    this.ViewBag.Title = "Ribeiro | MobileTrack | Abonos";
}

<div id="filterForm">
    <form action="@this.Url.Action("Index")" method="get">
        <span>Filtro:</span>
        <input style="border:1px solid #F26631" type="text" id="filter" name="filter" value="@ViewBag.Filter" />
        <a href="#" onclick="$('#filterForm form').submit();" style="text-decoration:none;" ><img alt="Filtrar" style="border:0px;vertical-align:text-bottom;padding:0px 2px;" src="~/Images/buscar2.png" /></a>
        <span>(ej: precio:90+operador:claro)</span>
    </form>
</div>

<div style="padding:5px;border:1px solid #aaaaaa;margin-bottom:10px;font-size:0.9em">
    <div>Operador:
        @foreach (string operador in (IEnumerable<string>)this.ViewBag.OperadoresFilter)
        {
            <span><a href="#" onclick="filterGrid('operador:' + '@operador')">@operador</a>&nbsp;</span>
        }
    </div>
</div>

<div>
    <table id="abonos">
    </table>
    <div id="abonospager">
    </div>
</div>

<div id="addAbonoDialog" title="Crear Abono">
</div>

<div id="editAbonoDialog" title="Editar Abono">
</div>

@section scripts {
    
    <script type="text/javascript">

        $(document).ready(function () {
            $('#abonos').jqGrid({
                url: '@this.Url.Action("List")',
                datatype: 'json',
                postData: { filter: $("<div/>").html('@this.Request.QueryString["filter"]').text() },
                shrinkToFit: true,
                forceFit: true,
                autowidth: true,
                rowNum: 50,
                rowList: [10, 50, 100],
                width: 'auto',
                height: 'auto',
                caption: "Abonos",
                sortable: false,
                cellEdit: true,
                multiselect: true,
                cellsubmit: 'clientArray',
                pager: '#abonospager',
                jsonReader: { repeatitems: false, id: '0' },
                colNames: ['Id', 'Descripcion', 'Precio', 'OperadorId', 'Operador', 'Inicio', 'Fin', 'Cant. Ventas'],
                colModel: [
                    { name: 'Id', index: 'Id' },
                    { name: 'Descripcion', index: 'Descripcion', width: 200 },
                    { name: 'Precio', index: 'Precio' },
                    { name: 'OperadorId', index: 'OperadorId', hidden: true },
                    { name: 'Operador', index: 'Operador' },
                    { name: 'Inicio', index: 'Inicio' },
                    { name: 'Fin', index: 'Fin' },
                    { name: 'CantVentas', index: 'CantVentas' }
   	            ]
            });

            $('#abonos').jqGrid(
                'navGrid',
                '#abonospager',
                {
                    search: false, refresh: true,
                @if (this.User.IsInRole(Constants.AdministradorRole) || this.User.IsInRole(Constants.AsocianteRole))
                {
                    <text>
                    addtitle: 'Crear Abono', deltitle: 'Eliminar Abono', edittitle: 'Editar Abono',
                    add: true, del: true, edit: true,
                    addfunc: function () { addAbono(); }, editfunc: function (id) { editAbono(id); },
                    delfunc: function (rows) {
                        if (confirm("¿Desea eliminar los abonos seleccionados?")) {
                            $.ajax({
                                url: '@this.Url.Action("DeleteAbono")',
                                type: 'POST',
                                data: { 'abonos': rows },
                                dataType: "json",
                                traditional: true,
                                success: function (result) {
                                    $("#abonos").trigger("reloadGrid");
                                    if (result.deleted) {
                                        var n = noty({ text: "La operacion se realizo exitosamente.", type: 'success' });
                                    }
                                }
                            });
                        }
                    }
                    </text>
                }
                else
                {
                    <text>
                    add: false, del: false, edit: false,
                    </text>
                }
                });

            $("#addAbonoDialog").dialog({
                modal: true,
                height: 400,
                width: 400,
                autoOpen: false,
                resizable: false,
                buttons: {
                    "Guardar": function () {
                        if ($("form").validate().form()) {
                            $.ajax({
                                url: '@this.Url.Action("AddAbono")',
                                type: 'POST',
                                data: $("#addAbonoDialog form").serialize(),
                                success: function (result) {
                                    if (result.saved) {
                                        $("#addAbonoDialog").dialog("close");
                                        var n = noty({ text: "La operacion se realizo exitosamente.", type: 'success' });
                                        $("#abonos").trigger("reloadGrid");
                                    }
                                    else {
                                        $("#addAbonoDialog").html(result);
                                        $("#addAbonoDialog form fieldset #FechaInicio").datepicker({ dateFormat: 'dd/mm/yy' });
                                        $("#addAbonoDialog form fieldset #FechaFin").datepicker({ dateFormat: 'dd/mm/yy' });
                                        $.validator.unobtrusive.parse('#addAbonoDialog');
                                        $("#addAbonoDialog").dialog('open');
                                    }
                                }
                            });
                        }
                    },
                    "Cancelar": function () {
                        $(this).dialog("close");
                    }
                }
            });

            $("#editAbonoDialog").dialog({
                modal: true,
                height: 400,
                width: 400,
                autoOpen: false,
                resizable: false,
                buttons: {
                    "Guardar": function () {
                        $.ajax({
                            url: '@this.Url.Action("EditAbono")',
                            type: 'POST',
                            data: $("#editAbonoDialog form").serialize(),
                            success: function (result) {
                                if (result.saved) {
                                    $("#editAbonoDialog").dialog("close");
                                    var n = noty({ text: "La operacion se realizo exitosamente.", type: 'success' });
                                    $("#abonos").trigger("reloadGrid");
                                }
                                else {
                                    $("#editAbonoDialog").html(result);
                                    $("#editAbonoDialog form fieldset #FechaInicio").datepicker({ dateFormat: 'dd/mm/yy' });
                                    $("#editAbonoDialog form fieldset #FechaFin").datepicker({ dateFormat: 'dd/mm/yy' });
                                    $.validator.unobtrusive.parse('#editAbonoDialog');
                                    $("#editAbonoDialog").dialog('open');
                                }
                            }
                        });
                    },
                    "Cancelar": function () {
                        $(this).dialog("close");
                    }
                }
            });

            $("#filterForm form").submit(function () {
                var filterStr = $("#filterForm form #filter").val();
                filterStr = $('<div/>').html(filterStr).text();
                filterGrid(filterStr);

                return false;
            });

        });

        function addAbono() {
            $.ajax({
                url: '@this.Url.Action("AddAbono")',
                type: "GET",
                success: function (result) {
                    $("#addAbonoDialog").html(result);
                    $("#addAbonoDialog form fieldset #FechaInicio").datepicker({ dateFormat: 'dd/mm/yy' });
                    $("#addAbonoDialog form fieldset #FechaFin").datepicker({ dateFormat: 'dd/mm/yy' });
                    $.validator.unobtrusive.parse('#addAbonoDialog');
                    $("#addAbonoDialog").dialog('open');
                }
            });
        }

        function editAbono(id) {
            $.ajax({
                url: '@this.Url.Action("EditAbono")',
                type: "GET",
                success: function (result) {
                    $("#editAbonoDialog").html(result);
                    var datarow = $("#abonos").jqGrid('getRowData', id);

                    $("#editAbonoDialog form fieldset #Id").val(datarow.Id);
                    $("#editAbonoDialog form fieldset #Descripcion").val(datarow.Descripcion);
                    $("#editAbonoDialog form fieldset #Precio").val(datarow.Precio);
                    $("#editAbonoDialog form fieldset #FechaInicio").val(datarow.Inicio);
                    $("#editAbonoDialog form fieldset #FechaFin").val(datarow.Fin);
                    $("#editAbonoDialog form fieldset #OperadorId option[value='" + datarow.OperadorId + "']").attr('selected', 'selected');

                    $("#editAbonoDialog form fieldset #FechaInicio").datepicker({ dateFormat: 'dd/mm/yy' });
                    $("#editAbonoDialog form fieldset #FechaFin").datepicker({ dateFormat: 'dd/mm/yy' });
                    $.validator.unobtrusive.parse('#editAbonoDialog');
                    $("#editAbonoDialog").dialog('open');
                }
            });
        }

        function filterGrid(filterStr) {
            $("#abonos").setGridParam({ postData: { filter: filterStr} });
            $("#abonos").trigger("reloadGrid");
            $("#filterForm form #filter").val(filterStr);
        }

    </script>
}